<template>
	<view class="page-content">
		<view class="u-p-20">
			<view class="box-radius u-p-28 data-box">
				<view class="u-flex u-m-b-20">
					<view class="u-content-color u-flex-1">
						用户名
					</view>
					<view class="">
						{{userInfo.nickName}}
					</view>
				</view>
				<view class="u-flex u-m-b-20">
					<view class="u-content-color u-flex-1">
						手机号
					</view>
					<view class="">
						{{hidePhone(userInfo.phone)}}
					</view>
				</view>
				<view class="u-flex">
					<view class="u-content-color u-flex-1">
						团队业绩
					</view>
					<view class="color-primary">
						￥{{detail.myPerformance||0}}
					</view>
				</view>
			</view>		
		</view>
		 <!-- @change="tabsChange" -->
		<u-tabs font-size="28" :gutter="30" :list="tabsList" inactive-color="#FFFFFF" active-color="#E88D1A"
			:is-scroll="false" v-model="tabsCurrent" bg-color="rgba(0,0,0,0)"></u-tabs>
		<view class="u-p-28">
			<view class="box-radius bgw u-p-20 u-m-b-20 u-flex" v-for="(item,index) in list" :key="item.sid">
				<u-avatar :src="baseImgUrl+item.avatar" size="100" v-if="item.avatar"></u-avatar>
				<u-avatar :src="defaultAvatar" size="100" v-else></u-avatar>
				<view class="u-flex-1 u-m-l-20">
					<view class="u-flex u-m-b-20">
						<view class="u-flex-1">
							{{item.nickName == item.phone ? hidePhone(item.nickName) : item.nickName}}
						</view>
						<view class="">
							<text class="u-m-l-20 u-font-24 u-tips-color">订单总金额：</text>
							<text class="color-red u-font-24">￥{{item.price}}</text>
						</view>
					</view>
					<view class="u-font-24">
						{{hidePhone(item.phone)}}
					</view>
				</view>
			</view>
			<view class="bgw box-radius u-p-20">
				<g-loadmore :status="loadmoreStatus" nodata-text="">
					<template #nodata>
						<view class="u-text-center" >
							<text class="u-tips-color">您还没有推荐用户注册，</text>
							<text class="color-primary" style="font-weight: bold;" @click="navLogin('/pages/share/share')">去邀请~</text>
						</view>
					</template>
				</g-loadmore>
			</view>
			<u-gap height="20"></u-gap>
		</view>
		
	</view>	
</template>


<script setup>
	import store from '@/store/index.js'; 
	import mixins from '@/common/js/mixins.js';
	import mixinList from '@/common/js/mixinList.js';
	import {
		ref,
		reactive,
		computed,
		watch,
		getCurrentInstance
	} from 'vue'
	import {
		onReady,
		onLoad,
		onShow,
		onPageScroll
	} from '@dcloudio/uni-app'
	const {
		proxy,
	} = getCurrentInstance()
	const {
		baseImgUrl,
		defaultAvatar
	} = proxy
	const {
		nav,
		navLogin,
		hidePhone
	} = proxy.$util;
	const {
		total,
		current_page,
		page_size,
		last_page,
		apiPath,
		loading,
		list,
		searchParams,
		getList,
		getNextList,
		loadmoreStatus,
		searchClear,
		searchConfirm
	} = mixinList();
	apiPath.value = 'getLowerUser'
	const userInfo = computed(() => store.state.$userInfo)
	const isLogin = computed(() => {
		return store.getters.get_isLogin
	})
	const tabsCurrent = ref(0)
	const tabsList = [{
			name: '我的直推下级',
			id: 0
		}
	];
	const detail = reactive({});
	const getData = () => {
		uni.showLoading({
			title: '加载中'
		});
		proxy.$u.api.getItem(1).then(res => {
			// console.log(res);
			let {
				code,
				msg,
				data
			} = res;
			if (code != 200) {
				uni.$u.toast(msg || '错误');
				return;
			}
			if(data && data.memberList){
				
			}else{
				// modal({
				// 	title:'暂无队伍',
				// 	content: '推荐好友下单报单区商品即可生成队伍。',
				// 	confirmText:'去邀请'
				// }).then(res=>{
				// 	navRedirectLogin('/pages/share/share')
				// })
			}
			for (let key in data) {
				detail[key] = data[key]
			}
		}).catch(res => {
			
		})
	}

	
	onReady(() => {
	
	})
	onLoad(async (d) => {
		getData();
		await getList(1)
		
	})
	onShow(() => {
	
	})
	onPageScroll(e => {
	
	})
</script>
<style lang="scss" scoped>
	.page-content {
		min-height: 100vh;
		background: linear-gradient(207deg, #117B12 49%, #17A919 100%);
	}
	.data-box{
		background: linear-gradient(180deg, #D1F9D1 0%, #FFFFFF 40%);
	}
</style>